<%@ page language="java" import="java.util.*" pageEncoding="utf-8"
         contentType="text/html; charset=utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>场地预约 - 徐二组体育馆网上系统</title>
    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script type="${pageContext.request.contextPath}/static/js/jquery-2.1.1.js" type="text/javascript"></script>
    <link href=" ${pageContext.request.contextPath}/static/css/nav.css" rel="stylesheet" type="text/css"/>
    <script src="${pageContext.request.contextPath}/static/js/nav.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/static/js/focus.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/static/js/timepicker.js" type="text/javascript"></script>
    <link href=" ${pageContext.request.contextPath}/static/css/common.css" rel="stylesheet" type="text/css"/>
    <link href=" ${pageContext.request.contextPath}/static/css/ground.css" rel="stylesheet" type="text/css"/>
</head>

<body>
<%@ include file="../header.jsp" %>
<div id="main">
    <div id="row_1">
        <div id="book-submit">
            <form action="${pageContext.request.contextPath}/book/insertBook">
                <p> 编&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号
                    <input id="placeID" name="placeID" type="text"
                           value="<%out.print(request.getAttribute("placeID"));%>"
                           readonly="readonly"/>
                </p>
                <p> 地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名
                    <input name="typeName" type="text"
                           value="<%out.print(request.getAttribute("placeName"));%>"
                           class="input-box"/>
                </p>
                <p> 单&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价
                    <input name="money" type="text"
                           value="<%out.print(request.getAttribute("money"));%>"
                           class="input-box" readonly="readonly"/>
                </p>
                <p> 预约日期
                    <input id="bookDate" name="bookDate" type="date" />
                </p>
                <p> 时间段
                    <select id="time-quantum" name="time" onkeyup="checkBook()">
                        <option value="8:00-10:00" selected>8:00-10:00</option>
                        <option value="10:00-12:00" >10:00-12:00</option>
                        <option value="14:00-16:00" >14:00-16:00</option>
                        <option value="16:00-18:00" >16:00-18:00</option>
                        <option value="18:00-20:00" >18:00-20:00</option>
                    </select>
                    <span id="checkBookTime"></span>
                </p>
                <br/>
                <p>
                    <input name="" type="submit" value="提交订单" class="btn-submit"/>
                </p>
            </form>
        </div>
    </div>
    <script>
      var def = "3";

      function checkBook() {
        var placeID = $("#placeID").val()
        var bookDate = $("#bookDate").val()
        var time = $("#time-quantum").val()

        $.ajax({
          url: "${pageContext.request.contextPath}/book/checkBook",
          type: "post",
          dataType: "json",
          data: {
            "bookDate": bookDate,
            "time": time,
            "placeID": placeID
          },
          async: false,
          success: function (data) {

            $("#checkBookTime")[0].innerHTML = data;

          }
        })
      }
    </script>
    <%@ include file="../footer.jsp" %>
</body>
</html>
